<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- -需求 必须是中文 2-4位 （中文匹配区间 [\u4e00-\u9fa5]）
    手机号
    - 总共11位 必须是1开头 第二位 可以是(3456789) 全部是数字
    身份证号
    - 总共18位 最后一位可以是数字和X
    邮箱
    - 数字字母下划线构成 必须有@符号
    - 后面可以是.com .xyz 等结尾
    - 也可以是 .com.cn .xyz.cn类似结构结尾 -->
    姓名： <input type="text" id='a'><br>
    手机号： <input type="text" id='aa'><br>
    身份证号：<input type="text" id="b"><br>
    邮箱： <input type="text" id="bb"><br>
    <button>点击</button>
    <script>
        //所有input框的值获取过来   
        var oA = document.getElementById('a');
        var oAa = document.getElementById('aa');
        var oB = document.getElementById('b');
        var oBb = document.getElementById('bb')
        var btn = document.querySelector("button")
        var obj = {
            a :false,
            aa:false,
            b :false,
            bb:false


        }



        btn.addEventListener('click', function () {
            var reg = /^[\u4e00-\u9fa5]{2,4}$/;

            var name = reg.test(oA.value)
            // console.log(reg.test(val));
            if (name == true) {
                alert('成功了');
                obj.a = ture;
            } else {
                alert('错误了')
                obj.a = false;
            }

        })

        btn.addEventListener('click', function () {
            var reg = /^1\d{10}$/;

            var phone = reg.test(oAa.value);
            // console.log(phone);
            if (phone == true) {
                alert('成功');
                obj.aa = ture;
            } else {
                alert('错误')
                obj.aa = false;
            }
        })
        btn.addEventListener('click', function () {
            var reg = /^\d{17}(\d|X|x)$/;

            var num = reg.test(oB.value);
            // console.log(num);
            if (num == true) {
                alert('成功输入');
                obj.b = true;
            } else {
                alert('错误')
                obj.b = false;
            }
        })
        btn.addEventListener('click', function () {
            var reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,3})$/;

            var qq = reg.test(oBb.value);
            console.log(qq);
            if (qq == true) {
                alert('成功输入');
                obj.bb = ture;
            } else {
                alert('错误')
                obj.bb = false;
            }
        })
        btn.addEventListener('click',function(){
            var flag = true;
            for(var key in obj){
                if(!obj[key]){
                    flag = false;
                }
            }
            if(flag){
                console.log('提交成功');
            }
            else{
                console.log('提交不成功');
            }
        })



    </script>

</body>

</html>